<template>
  <el-dialog v-model="lkxxDialog" title="路况信息" @closed="handleclose">
    <el-form-item label="路况报告表" :label-width="formLabelWidth">
      <el-table :data="roadcon" stripe height="300px" row-height="100">
        <el-table-column
          property="user_name"
          label="用户名"
          width="100"
          height="20px"
        />
        <el-table-column
          property="roadcon_type"
          label="事件类型"
          width="100"
          height="20px"
        />
        <el-table-column
          property="roadcon_site"
          label="事件地址"
          width="100"
          height="20px"
        />
        <el-table-column
          property="roadcon_mark"
          label="附近建筑"
          width="100"
          height="20px"
        />
        <el-table-column
          property="roadcon_time"
          label="发生时间"
          width="100"
          height="20px"
        />
        <el-table-column
          property="roadcon_describle"
          label="事件描述"
          width="100"
          height="20px"
        />
        <el-table-column label="操作" fixed="right">
          <template #default="scope">
            <div style="display: flex;flex-direction:column; justify-content: center;">
              <el-button
                size="small"
                type="success"
                @click="handleEdit(scope.$index, scope.row)"
                >通过</el-button
              >
              <el-button
                size="small"
                type="info"
                @click="handleDelete(scope.$index, scope.row)"
                >忽略</el-button
              >
            </div>
          </template>
        </el-table-column>
      </el-table>
    </el-form-item>
  </el-dialog>
</template>

<script setup>
import { reactive, ref } from 'vue'
import { useUsersStore } from '@/stores/user'
import { storeToRefs } from 'pinia'
// const fbggDialog = ref(false)
const formLabelWidth = '60px'

//使用pina
const store = useUsersStore()
const { lkxxDialog, activeIndex } = storeToRefs(store)
const notice = reactive({
  content: '',
  time: '',
})
//关闭按钮执行的方法
function handleclose() {
  store.lkxxDialog = false
  store.activeIndex = '0'
}
//表格假数据
const roadcon = [
  {
    roadcon_id: 0,
    user_name: '测试数据1',
    roadcon_type: '测试数据1',
    roadcon_site: '测试数据1',
    roadcon_mark: '测试数据1',
    roadcon_time: '测试数据1',
    roadcon_describle: '测试数据1',
    roadcon_status: 0,
  },
  {
    roadcon_id: 1,
    user_name: '测试数据2',
    roadcon_type: '测试数据2',
    roadcon_site: '测试数据2',
    roadcon_mark: '测试数据2',
    roadcon_time: '测试数据2',
    roadcon_describle: '测试数据2',
    roadcon_status: 1,
  },
  {
    roadcon_id: 2,
    user_name: '测试数据3',
    roadcon_type: '测试数据3',
    roadcon_site: '测试数据3',
    roadcon_mark: '测试数据3',
    roadcon_time: '测试数据3',
    roadcon_describle: '测试数据3',
    roadcon_status: 2,
  },
]
</script>
<style scoped>
.el-button+.el-button{
  margin-top: 2px;
  margin-left: 0;
}</style>
